<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>showBooks</title>
    <link rel="stylesheet" th:href="@{/css/bookList.css}">  <!-- 必须使用thymeleaf的href才能在运行时在网页中找到该css文件，
                                                                 否则就算在此能够使用ctrl+左键能够找到，运行时网页里还是找不到的 -->

</head>
<body>
<div class="wrapper">
    <div class="headList" th:data="${(not #strings.isEmpty(language)) ? language : '综合' }">
        <ul>
            <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time='+${time}}">综合</a></li>
            <!-- 循环读取数据库中的数据 -->
            <li th:each="tl:${languageList}">
                <a th:if="${tl.name!='C#'}" th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time='+${time}+'&language='+${tl.name}}" th:text="${tl.name}"></a>
                <a th:unless="${tl.name!='C#'}" th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time='+${time}+'&language=C%23'}" th:text="${tl.name}"></a>
            </li>
        </ul>
    </div>
    <div class="filter">
        <div>
            <ul class="order" th:data="${(not #strings.isEmpty(order)) ? order : '综合排序' }">
                <li><a th:href="@{'bookList?order=综合排序&size='+${size}+'&time='+${time}+'&language='+${language}}">综合排序</a></li>
                <li><a th:href="@{'bookList?order=点击最多&size='+${size}+'&time='+${time}+'&language='+${language}}">点击最多</a></li>
                <li><a th:href="@{'bookList?order=点赞最多&size='+${size}+'&time='+${time}+'&language='+${language}}">点赞最多</a></li>
                <li><a th:href="@{'bookList?order=收藏最多&size='+${size}+'&time='+${time}+'&language='+${language}}">收藏最多</a></li>
                <li><a th:href="@{'bookList?order=下载最多&size='+${size}+'&time='+${time}+'&language='+${language}}">下载最多</a></li>
            </ul>
        </div>
        <div>
            <ul class="size" th:data="${(not #strings.isEmpty(size)) ? size : '全部大小' }">
                <li><a th:href="@{'bookList?order='+${order}+'&size=全部大小&time='+${time}+'&language='+${language}}">全部大小</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size=小于1M&time='+${time}+'&language='+${language}}">小于1M</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size=1~10M&time='+${time}+'&language='+${language}}">1~10M</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size=10~30M&time='+${time}+'&language='+${language}}">10~30M</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size=30~100M&time='+${time}+'&language='+${language}}">30~100M</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size=100M以上&time='+${time}+'&language='+${language}}">100M以上</a></li>
            </ul>
        </div>
        <div>
            <ul class="time" th:data="${(not #strings.isEmpty(time)) ? time : '全部时间' }">
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=全部时间&language='+${language}}">全部时间</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=2021&language='+${language}}">2021</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=2020&language='+${language}}">2020</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=2019&language='+${language}}">2019</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=2018&language='+${language}}">2018</a></li>
                <li><a th:href="@{'bookList?order='+${order}+'&size='+${size}+'&time=更早&language='+${language}}">更早</a></li>
            </ul>
        </div>
    </div>
    <div class="mainContent">
        <div class="contentHeader">
            <label>查询到：<em th:text="${booksCount}">99</em> 条相关记录，<em th:text="${offset+1}+'-'+${(offset+limit)>booksCount ? booksCount : (offset+limit)}">1-6</em> 条显示如下：</label><br/>
            <hr/>
        </div>
        <div class="content">
            <ul class="bookList">
                <li th:each="bookE:${bookList}" >
                    <div class="bookInfo">
                        <h3><a th:href="'bookDetail?bookId='+${bookE.book.objectid}" th:text="${bookE.book.name}">Spring boot+Maven入门.pdf</a></h3>
                        <label>
                            人气：<em th:text="${bookE.observations}">21</em>&emsp;
                            下载次数：<em  th:class="${'downloadCount-'+bookE.book.objectid}" th:text="${bookE.downloads}">2</em>&emsp;
                            下载所需积分：<em th:text="${bookE.book.integral}">2</em>&emsp;&emsp;
                            <a href="">共 5 条回复</a>
                        </label>
                    </div>
                    <div class="about">
                        <p>
                            <span>开发语言：<em th:each="label:${bookE.book.labelList}" th:if="${not #strings.isEmpty(label.tl)} and ${label.tl.type}=='语言'" th:text="${label.tl.name}">Java</em></span>&emsp;|&emsp;
                            <span>大小：<em th:text="${bookE.book.k+'M'}">7.40M</em></span>&emsp;|&emsp;
                            <span>发布时间：<em th:text="${bookE.book.createtime}">2020-7-18</em></span>&emsp;|&emsp;
                            <span>发布人：<em th:if="${not #strings.isEmpty(bookE.book.user)}" th:text="${bookE.book.user.nickname}">luozengliang</em></span>
                        </p>
                        <p>相关标签: <a class="relevant" href="#" th:each="label:${bookE.book.labelList}" th:if="${not #strings.isEmpty(label.tl)} and ${label.tl.type}=='框架'" th:text="${label.tl.name}">Spring</a></p>
                        <h3><a href="##" class="download" th:data="${bookE.book.objectid}">立即下载</a></h3><a href="#"><img th:src="@{/img/downloadB.png}" alt=""/></a>
                    </div>
                </li>
            </ul>
            <div class="contentFooter">
                <label class="tp">共：<em th:text="${booksCount%limit==0?booksCount/limit:booksCount/limit+1}">300</em> 页次：&nbsp;<em th:text="${offset/limit+1}">1</em>/<em th:text="${booksCount%limit==0?booksCount/limit:booksCount/limit+1}">300</em> &emsp;每页：<em th:text="${limit}">25</em></label>
                <label class="pg">
                    <a th:href="@{'bookList?offset=0&limit='+${limit}+'&language='+${language}+'&order='+${order}+'&size='+${size}+'&time='+${time}}">首页</a>&emsp;
                    <a th:href="@{'bookList?offset='+${offset==0 ? offset : (offset - limit)}+'&limit='+${limit}+'&language='+${language}+'&order='+${order}+'&size='+${size}+'&time='+${time}}">上一页</a>&emsp;
                    <em th:text="${offset/limit+1}">1</em>&emsp;
                    <a th:href="@{'bookList?offset='+${(offset+limit)>=booksCount ? offset : (offset + limit)}+'&limit='+${limit}+'&language='+${language}+'&order='+${order}+'&size='+${size}+'&time='+${time}}">下一页</a>&emsp;
                    <a th:href="@{'bookList?offset='+${booksCount % limit==0 ? (booksCount/limit - 1)*limit : booksCount/limit*limit}+'&limit='+${limit}+'&language='+${language}+'&order='+${order}+'&size='+${size}+'&time='+${time}}">尾页</a>
                </label>
            </div>
        </div>
    </div>
</div>
</body>
<script th:src="@{https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js}"></script>
<script type="text/javascript" th:src="@{/js/bookList.js}"></script>
<script th:inline="javascript">

</script>
</html>